<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>vueDemo-天气查询</title>
    <link rel="stylesheet" href="main.css">
    <script>
        window.onload=function(){
           
        }
    </script>
</head>
<body>
    <div id="root" class="w">
       
        <!-- 标题 -->
         <h3>天气查询</h3>
        <!-- 这是查询栏 -->
    <span>   
    <div class="search">
    <input type="text" v-model='city' @keyup.enter='searchWeather'>
    <button @click='searchWeather'>get请求</button>
    </div>
    
    </span>
<!-- 天气内容显示 -->   
    <ul >
        <p>当前城市：{{city}}</p>
        <li  v-for="item in weather" class="weatherlist">
           <div class="info_type"> {{item.type}}</div> 
           <div class="info_wendu">
             {{item.high}}~{{item.low}}
            </div>
            <p>{{item.date}}</p>
            <!-- <span>{{ganmao}}</span> -->
        </li>
        
    </ul>
    

</div>
</body>
    <script src="../node_modules/vue/dist/vue.min.js"></script>
     <script src="../node_modules/axios/dist/axios.min.js"></script>
    <script src="main.js"></script>
    
    
</html>